<template>
  <div>
    <div class="header">
      <van-nav-bar title="联系人" @click-left="$router.go(-1)">
        <template #left>
          <van-icon name="arrow-left" size="25" color='black' />
        </template>
      </van-nav-bar>
    </div>

    <div class="main">

      <van-contact-card type="add" @click="onAdd" />
      <van-contact-card type="edit" :name="currentContact.name" :tel="currentContact.tel" @click="onEdit" />

      
    </div>



  </div>
</template>

<script>
import Vue from 'vue';
import { ContactCard, Toast } from 'vant';

Vue.use(ContactCard);
Vue.use(Toast);
export default {
  data() {
    return {
      currentContact: {
        name: '张三',
        tel: '13000000000',
      },
    };
  },
  methods: {
    onEdit() {
      Toast('编辑');
    },
    onAdd() {
      Toast('新增');
    },
  },
}
</script>

<style>

</style>